{% extends 'base.html' %}
{% block headcontent %}
<link rel="stylesheet" href="/static/fonts/css0f7c.css?family=Open+Sans:300,400,600,700,800" >
<link rel="stylesheet" href="/static/fonts/css1180.css?family=Quicksand:500,700">
<link rel="stylesheet" type="text/css" href="/static/bower_components/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="/static/assets/pages/waves/css/waves.min.css"  media="all">
<link rel="stylesheet" type="text/css" href="/static/assets/icon/feather/css/feather.css">
<link rel="stylesheet" type="text/css" href="/static/assets/icon/themify-icons/themify-icons.css">
<link rel="stylesheet" type="text/css" href="/static/assets/icon/icofont/css/icofont.css">
<link rel="stylesheet" type="text/css" href="/static/assets/icon/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="/static/bower_components/jstree/css/style.min.css">
<link rel="stylesheet" type="text/css" href="/static/assets/pages/treeview/treeview.css">
<link rel="stylesheet" type="text/css" href="/static/assets/css/style.css">
<link rel="stylesheet" type="text/css" href="/static/assets/css/pages.css">
<link rel="stylesheet" type="text/css" href="/static/bower_components/datatables.net-bs4/css/dataTables.bootstrap4.min.css">
<link rel="stylesheet" type="text/css" href="/static/assets/pages/data-table/css/buttons.dataTables.min.css">
<link rel="stylesheet" type="text/css" href="/static/bower_components/datatables.net-responsive-bs4/css/responsive.bootstrap4.min.css">



{% endblock %}
{% block bodycontent %}

<div class="pcoded-content">
  <div class="page-header card">
    <div class="row align-items-end">
      <div class="col-lg-8">
        <div class="page-header-title">
          <i class="feather icon-gitlab bg-c-blue"></i>
          <div class="d-inline">
            <h5>Redis 集群</h5>
            <span> 管理所有的Redis 集群</span>
          </div>
        </div>
      </div>
      <div class="col-lg-4">
        <div class="page-header-breadcrumb">
          <ul class=" breadcrumb breadcrumb-title">
            <li class="breadcrumb-item">
              <a href="/index/">
                <i class="feather icon-home"></i>
              </a>
            </li>

            <li class="breadcrumb-item">
              <a href="/redis/">Redis</a>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
  <div class="pcoded-inner-content">
    <div class="main-body">
      <div class="page-wrapper">
        <div class="page-body">
          <div class="row">
            <div class="col-sm-8 col-lg-3">
              <div class="card">
                <div class="card-header"><h5>Redis 集群</h5></div>
                <div class="card-block">
                  <div class="card-block tree-view">
                    <div id="dragTree" tabindex="-1">
                    <ul>
                        <li>Redis 集群
                        <ul>
                        {% for redis in rediscluster %}
                            <li data-jstree='{"opened":true}'>
                            <a class="button"  onclick ="GetRedisInfo({{redis.ID}})" ><span>{{ redis.ClusterName }}</span></a>
                            </li>
                        {% endfor %}
                            <li data-jstree='{"opened":true,"selected":true,"type":"file"}'>
                            <a class="button"  ><span> --- </span></a>
                            </li>
                        </ul>
                        </li>
                    </ul>
                    </div><!-- dragTree -->
                  </div><!-- card-block tree-view -->
             </div><!-- card-block -->
          </div><!-- card -->
        </div><!-- col tree-->
        <div class="col-sm-8 col-lg-9">
            <div class="card">
                <div class="card-header">
                </div>
                <div class="card-block">
                <button type="button" onclick="OpenRedisCluster()" class="btn btn-primary m-b-20">查看集群信息</button>
                    <div class="dt-responsive table-responsive">
                        <table id="order-table" class="table table-striped table-bordered nowrap">
                            <thead>
                                <tr>
                                <th>id</th>
                                <th>IP</th>
                                <th>端口</th>
                                <th>更新时间</th>
                                </tr>
                            </thead>
                            <tbody  >

                              </tbody>
                              <tfoot>
                                <tr>
                                <th>id</th>
                                <th>IP</th>
                                <th>端口</th>
                                <th>更新时间</th>
                                </tr>
                              </tfoot>
                            </table>
                    </div><!-- dt-responsive table-responsive -->
                </div><!-- dt card-block -->
           </div> <!-- dt card -->
         </div> <!-- dt col -->
        </div><!-- row -->
      </div><!-- page-body -->
    </div><!-- page-wrapper -->
  </div><!-- main-body -->
</div><!-- pcoded-inner-content -->
<div id="styleSelector"></div>


{% endblock %}
{% block endcontent %}


<script type="text/javascript">
    tag = -1
    function OpenRedisCluster(){
        if (tag >= 0)
        {
            window.location.href="/service/redis/info/"+tag+"/"; 
        }
    };


    function GetRedisInfo(id) {
        var t = $('#order-table').DataTable();
        tag = id;
        t.clear();
        $.get("/api/redis/"+id+"/",function(result){
            for(i = 0,len=result.length; i < len; i++) {
                t.row.add(result[i]).draw();
                };
            });
        };
</script>


<script type="text/javascript" src="/static/bower_components/jquery/js/jquery.min.js"></script>
<script type="text/javascript" src="/static/bower_components/jquery-ui/js/jquery-ui.min.js"></script>
<script type="text/javascript" src="/static/bower_components/popper.js/js/popper.min.js"></script>
<script type="text/javascript" src="/static/bower_components/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/static/assets/pages/waves/js/waves.min.js"></script>
<script type="text/javascript" src="/static/bower_components/jquery-slimscroll/js/jquery.slimscroll.js"></script>
<script type="text/javascript" src="/static/bower_components/modernizr/js/modernizr.js"></script>
<script type="text/javascript" src="/static/bower_components/modernizr/js/css-scrollbars.js"></script>
<script type="text/javascript" src="/static/bower_components/jstree/js/jstree.min.js"></script>
<script type="text/javascript" src="/static/assets/pages/treeview/jquery.tree.js"></script>
<script type="text/javascript" src="/static/assets/js/pcoded.min.js" ></script>
<script type="text/javascript" src="/static/assets/js/vertical/vertical-layout.min.js" ></script>
<script type="text/javascript" src="/static/assets/js/jquery.mCustomScrollbar.concat.min.js" ></script>
<script type="text/javascript" src="/static/assets/js/script.js"></script>
<script type="text/javascript" src="/static/bower_components/datatables.net/js/jquery.dataTables.min.js" ></script>
<script type="text/javascript" src="/static/bower_components/datatables.net-buttons/js/dataTables.buttons.min.js" ></script>
<script type="text/javascript" src="/static/assets/pages/data-table/js/jszip.min.js" ></script>
<script type="text/javascript" src="/static/assets/pages/data-table/js/pdfmake.min.js" ></script>
<script type="text/javascript" src="/static/assets/pages/data-table/js/vfs_fonts.js" ></script>
<script type="text/javascript" src="/static/bower_components/datatables.net-buttons/js/buttons.print.min.js" ></script>
<script type="text/javascript" src="/static/bower_components/datatables.net-buttons/js/buttons.html5.min.js" ></script>
<script type="text/javascript" src="/static/bower_components/datatables.net-bs4/js/dataTables.bootstrap4.min.js" ></script>
<script type="text/javascript" src="/static/bower_components/datatables.net-responsive/js/dataTables.responsive.min.js" ></script>
<script type="text/javascript" src="/static/bower_components/datatables.net-responsive-bs4/js/responsive.bootstrap4.min.js" ></script>
<script type="text/javascript" src="/static/assets/pages/data-table/js/data-table-custom.js" ></script>
<script type="text/javascript" async src="/static/gtag/jsa055?id=UA-23581568-13"></script>
<script type="text/javascript">
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'UA-23581568-13');
</script>
<script src="/static/cloudflare-static/rocket-loader.min.js" data-cf-settings="49" defer=""></script>

{% endblock %}
